<template>
  <div style="padding: 10px;">
    <a-card title="项目概况">
      <a-card-grid style="width: 25%;height: 200px;  ">
        <p>在租合同</p>
        <p style="font-size: 24px;">0</p>
        <a-divider />
        <p>房源数量：134</p>
      </a-card-grid>
      <a-card-grid style="width: 25%;height: 200px;  ">
        <p>管理面积</p>
        <p style="font-size: 24px;">0.00㎡</p>
        <a-divider />
        <p>建筑面积：0.00㎡</p>
      </a-card-grid>
      <a-card-grid style="width: 25%;height: 200px;  ">
        <p>在住实时均价</p>
        <p style="font-size: 24px;">0</p>
        <a-divider />
        <p>>0.00元/㎡天</p>
      </a-card-grid>
      <a-card-grid style="width: 25%;height: 200px;  ">
        <p>出租率</p>
        <p style="font-size: 24px;">0%</p>
        <a-divider />
        <p>建筑面积：0.00㎡</p>
      </a-card-grid>
    </a-card>
    <a-card title="租客分析">
      <a-card-grid style="width: 33%;height: 200px;  ">
        <MinusOutlined style="transform: rotate(90deg);color: #1890ff;" /> 租客行业
        <a-empty />
      </a-card-grid>
      <a-card-grid style="width: 33%;height: 200px;  ">
        <MinusOutlined style="transform: rotate(90deg);color: #1890ff;" /> 租客标签
        <a-empty />
      </a-card-grid>
      <a-card-grid style="width: 33%;height: 200px;  ">
        <MinusOutlined style="transform: rotate(90deg);color: #1890ff;" /> 租赁面积排行
        <a-empty />
      </a-card-grid>

    </a-card>

    <a-card title="租金单价排行">
      <a-table :columns="columns" :data-source="tableData" :pagination="false">
        <template #custom-empty>
          <a-empty v-if="tableData.length === 0" />
        </template>
      </a-table>
    </a-card>
  </div>
</template>

<script setup>

</script>

<style lang="scss" scoped></style>